<template>
    <div class="todo">
        <input type="text" v-model="todo.title" />
        <div @click="$emit('del', todo)">删除</div>
    </div>
</template>

<script>
export default {
    props: ["todo"]
};
</script>

<style>
.todo {
    display: flex;
    border: solid 2px #ddd;
    margin-bottom: 1rem;
}
.todo > input {
    flex: 1;
}
.todo > div {
    background: #333;
    padding: 10px;
    color: #fff;
}
</style>
